<template>
	<el-form   ref="brandSelect" :rules="rules">
		<el-form-item label="汽车品牌" :label-width="formLabelWidth" prop="pinpai.id"> 
        	<el-select v-model.number="pinpai.id"  placeholder="汽车品牌" filterable  :disabled="isDisabled" @change="getCarSubBrand"  >
		       <el-option  v-for="(item,index) in selectCarBrandModel"  :label="item.name"  :value="item.id"  :key="index" >  
               </el-option>  
		    </el-select>
	    </el-form-item>
	    <el-form-item label="汽车子品牌" :label-width="formLabelWidth" prop="zipinpai.id">
	      	<el-select v-model.number="zipinpai.id" placeholder="汽车子品牌" filterable :disabled="isDisabled||!zipinpai.id" @change="getCarSeries" >
		       <el-option v-for="(item,index) in selectCarSubBrand" :label="item.name" :value="item.id" :key="index" >   
               </el-option>  
		    </el-select>
	    </el-form-item>
	    <el-form-item label="汽车车系" :label-width="formLabelWidth" prop="chexi.id"> 
	    	<el-select v-model.number="chexi.id" placeholder="汽车车系" filterable :disabled="isDisabled||!zipinpai.id" @change="getCarType" >
		       <el-option v-for="(item,index) in selectCarSeries" :label="item.name" :value="item.id" :key="index" >  
               </el-option>  
		    </el-select> 
	    </el-form-item>
	    <el-form-item label="汽车车型"  :label-width="formLabelWidth" prop="chexing.id">
	    	
	     	<el-select  v-model.number="chexing.id" ref="selectCarType" filterable placeholder="汽车车型" :disabled="isShowCarType||isDisabled"  @change="sendData">
		       <el-option v-for="(item,index) in selectCarType" :label="item.name" :value="item.id" :key="index" >  
		       	<span style="float: left">{{ item.name  }}</span>
                <span style="float: right; color: #48576a; font-size: 15px;margin-right:120px;">{{ item.yearType +"&nbsp&nbsp&nbsp&nbsp"+item.carSpecificationName+"&nbsp&nbsp&nbsp&nbsp"+item.price}}</span>
               </el-option>  
		    </el-select> 
	    </el-form-item>	 
	</el-form>
</template>
<script>
    import agentHttp from '@/utils/agentHttp.js'
    export default{
		created(){
            this.getSelectCarBrandModel();	  
        },
        mounted(){
			
    	    this.pinpai.id=this.pinpaiId||""
    	    this.zipinpai.id=this.zipinpaiId||""
    	    this.chexi.id=this.chexiId||""
			this.chexing.id=this.chexingId||""

    	    if(this.noCounty){
    	   	    this.link=this.noCounty
    	    }
    	    if(!this.pinpaiId||this.pinpaiId=="undefined"){
    	   	    this.zipinpaiReload=true;
    	   	    this.chexiReload=true;
				this.chexingReload=true;
    	    }


        },
		props:['isDisabled','pinpaiId','zipinpaiId','chexiId','chexingId','noCounty','formLabelWidth','carOrderId'],
		data(){			
			return{
				pinpai:{id:"",name:""},
				zipinpai:{id:"",name:""},
				chexi:{id:"",name:""},
		        chexing:{id:"",name:""},

		        zipinpaiReload:false,
		        chexiReload:false,
		        chexingReload:false,
		        link:false,
                
		        //品牌list
				selectCarBrandModel:[],
				//子品牌
				selectCarSubBrand:[],
				//车系
				selectCarSeries:[],
				//车型
				selectCarType:[],
				//是否可编辑车型
				isShowCarType:false,

				rules: {
                    'pinpai.id':[{required:true,message:"汽车品牌不能为空",trigger: "blur",type:"number"}],
	                'zipinpai.id':[{required:true,message:"汽车子品牌不能为空",trigger: "blur",type:"number"}],
	                'chexi.id':[{required:true,message:"汽车车系不能为空",trigger: "blur",type:"number"}],
	                'chexing.id':[{required:true,message:"汽车车型不能为空",trigger: "blur",type:"number"}],
				}
			}
		},
		methods:{
		    getSelectCarBrandModel(){  
		    	if(this.carOrderId){
		    		agentHttp.get('adminApi/admin/car_order/first_audit_order/view/'+this.carOrderId).then((data)=>{
			            if(data.success){ 
			              //品牌
						  this.selectCarBrandModel =  data.data.carBrand;  
			            } 
			        })
		    	}else{
		    		
		    		agentHttp.get('adminApi/admin/dictionary/find_all_car_brand').then((data)=>{
			            if(data.success){ 
			              //品牌
			              this.selectCarBrandModel =  data.data;  
			            } 
			        })
		    	}
		  	    
		    },
		     //根据品牌查询子品牌
		    getCarSubBrand(){  
		    	if (this.pinpai.id != '' || this.pinpai.id != null) {
			    	agentHttp.get('adminApi/admin/dictionary/find_car_sub_brand/'+this.pinpai.id).then((data)=>{
			            if(data.success){ 
							
							this.selectCarSubBrand = data.data;
							
			                if (this.zipinpaiReload) {
			                	if(data.data&&data.data.length>0){
									this.zipinpai.id = data.data[0].id; 
									
								}
								else{
									this.zipinpai.id=""
									
			                	}
			            		
							}
							
			            	this.zipinpaiReload = true;
			            	this.getCarSeries()
			            }
	 						 
			        })
		        }
		    },
		    //车系
		    getCarSeries(){  
				
		    //   this.selectCarSeries = [];  
		    //   if(this.selectCarSubBrand.length>0){
		    // 	  for (var i = 0; i < this.selectCarSubBrand.length; i++) {
			//     	  	if(this.selectCarSubBrand[i].id === this.zipinpai.id){
		    // 	  			this.selectCarSeries=this.selectCarSubBrand[i].carSeries;
		    // 	  			   if (this.chexiReload) {
		    // 	  			   	    if(this.selectCarSeries.length>0){
		    // 	  			   	    	this.chexi.id = this.selectCarSeries[0].id;
		    // 	  			   	    }else{
		    // 	  			   	    	this.chexi.id=""
		    // 	  			   	    }
				            		
			// 	            	}
			// 	            	this.chexiReload = true;	
			//     	  	} 
		    // 	  }
			//   }
					
			
		    	if (this.zipinpai) {
				    agentHttp.get('adminApi/admin/dictionary/find_car_series/'+this.zipinpai.id).then((data)=>{
			            if(data.success){     
							this.selectCarSeries = data.data;
							
			                if (this.chexiReload) {
								
								
			                	if(data.data&&data.data.length>0){
									this.chexi.id = data.data[0].id;
									
								}
								else{
			                		this.chexi.id=""
			                	}
			            	}
			            	this.chexiReload = true;
			            	this.getCarType()	
			            }
		 						 
				    })  
			    }
	    	}, 
	    	//车型
		    getCarType(){  
		    	if (this.chexi.id != '' || this.chexi.id != null) {
				    agentHttp.get('adminApi/admin/dictionary/find_car_type/'+this.chexi.id).then((data)=>{
			            if(data.success){   
							  
							this.selectCarType = data.data.types; 
			                if(this.selectCarType.length == 0 ){
			                	this.isShowCarType = true;
			                	this.chexing.id="";
			                	//this.dialogForm.carTypeId = "";
								// return ;

								// var chexings =this.selectCarType.filter((item,index)=>{
								// return 	this.chexing.id==item.id
								// 	})	
							
								// this.chexings.id = chexings[0].name
								
			                }else{
								this.isShowCarType = false;
								this.chexing.id =  data.data.types[0].id;
								
			                }
			                if (this.chexingReload) {
								this.chexing.id =  data.data.types[0].id;
								
							}
						
						
							this.chexingReload = true;
			            	this.$emit('receive-brand-data',this.pinpai.id,this.zipinpai.id,this.chexi.id,this.chexing.id);
			            }
		 						 
				    })  
			    }
	    	},
	    	sendData(){
	    		var json="";
                for(let i=0;i<this.selectCarType.length;i++){
                	if(this.selectCarType[i].id==this.chexing.id){
                        var json=this.selectCarType[i];
                	}
				}
	    		this.$emit('receive-brand-data',this.pinpai.id,this.zipinpai.id,this.chexi.id,this.chexing.id,json);
	    	}
		}
	};	
</script>
